<template>
    <div class="changeAddBox">
        <el-form :model="formData" :rules="rules" ref="myForm" class="changeBox">
				<el-form-item label="班级名称 :" prop="className">
					<el-input v-model="formData.className" placeholder="请输入新的班级名称"></el-input>
				</el-form-item>
				<el-form-item label="上课教室 :" prop="classRoom">
					<el-input v-model="formData.classRoom" placeholder="请输入上课教室"></el-input>
				</el-form-item>
				<el-form-item label="负责人 :" prop="classHead">
					<el-select v-if="name" v-model="formData.teaId" class="placehole" :placeholder="name">
						<el-option 
                            v-for="item in Head" 
                            :key="item.teaId" 
                            :label="item.teaName" 
                            :value="item.teaId">
						</el-option>
					</el-select>
                    <el-select v-else v-model="formData.teaId" placeholder="请选择负责人(可不选)">
						<el-option 
                            v-for="item in Head" 
                            :key="item.teaId" 
                            :label="item.teaName" 
                            :value="item.teaId">
						</el-option>
					</el-select>
				</el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button style="background: #106ab1; color: #fff;" @click="ClassBtn('myForm')" >确 定</el-button>
            <el-button style="background: #999; color: #fff;" @click="exit('myForm')">取 消</el-button>
        </span>
    </div>
</template>

<script>
export default {
    props:['classData','getClass'],
    data(){
        return {
            baseUrl:require("../js/baseUrl.js").baseUrl,
            Head:[],
            formData:{
                className:'',
                classRoom:'',
                teaId:'',
                classHead:""
            },
            rules: {
                className: [
                    {
                        required: true,
                        message: "新的班级名称不能为空",
                        trigger: "blur"
                    },
                ],
                classRoom: [
                    {
                        required: true,
                        message: "上课教室不能为空",
                        trigger: "blur"
                    },
                ],
                teaId: [
                    {
                        required: true,
                        message: "负责人不能为空",
                        trigger: 'change'
                    },
                ],
            },
            pageIndex:1,
            pageSize:1,
            total:0,
            name:'',
            flag:true
        }
    },
    methods:{
        ClassBtn(form){
            if(this.classData!=""){
                this.changeClass(form)
            }else{
                this.addClass(form)
            }
        },
        //班级添加:SchoolSys/clazz/insert
        addClass(form){
            this.$refs[form].validate(valid=>{
                if(valid){
                    this.$http.post(this.baseUrl+'SchoolSys/clazz/insert',{
                    clazzName:this.formData.className,
                    teaId:this.formData.teaId+'',
                    clazzRoom:this.formData.classRoom,
                    }).then(res=>{
                        // console.log(res);
                        if(res.data.code==200){
                            this.$message.success('班级添加成功')
                            this.formData={
                                className:'',
                                classRoom:'',
                                classHead:'',
                            }
                            this.$emit('getClass')

                        }else{
                            this.$message.error('班级添加失败')  
                        }
                    })
                }
            }) 
        },
        //班级修改：SchoolSys/clazz/update
        changeClass(form){
            console.log(this.formData)
            var that=this
            this.$refs[form].validate(valid=>{
                if(valid){
                    this.$http.post(this.baseUrl+'SchoolSys/clazz/update',{
                        clazzId:that.classData.clazzId+'',
                        clazzName:this.formData.className,
                        teaId:this.formData.teaId,
                        clazzRoom:this.formData.classRoom
                    }).then(res=>{
                        if(res.data.code==200){
                            this.$message.success('该班级修改成功')
                            this.$emit('getClass')
                            this.formData={
                                className:'',
                                classRoom:'',
                                classHead:'',
                            }
                        }else{
                            this.$message.error('该班级修改失败')  
                        }
                    })
                }
            })
        },
        //获取负责人：SchoolSys/teaList
        getTeacher(){
            this.$http.post(this.baseUrl+'SchoolSys/getTeachersByCondition',{
                "page":this.pageIndex+"",//页数
				"size":this.pageSize+""
            }).then(res=>{
                // console.log(res.data.data);
                if(res.data.code==200){
                    this.total=res.data.data.totalPages*this.pageSize
                    // console.log(this.total);
                    this.getTea()
                }
            })
        },
        getTea(){
            this.$http.post(this.baseUrl+'SchoolSys/getTeachersByCondition',{
                "page":this.pageIndex+"",//页数
				"size":this.total+""
            }).then(res=>{
                console.log(res.data.data);
                if(res.data.code==200){
                  this.Head=res.data.data.teachers.filter(v=>v.titleName=='班主任')
                }
            })
        },
        //取消
        exit(formName){
            this.$refs[formName].resetFields();
            this.$emit('getClass')
        }
    },
    mounted(){
        if(this.classData){
            this.formData={
                className:this.classData.clazzName,
                classRoom:this.classData.clazzRoom,
                classHead:this.classData.teaName,
            }
           
            this.name=this.classData.teaName
            // console.log('fff',this.name);
        }
        this.getTeacher()
        // this.getTea()
    },
    watch:{
        classData(){
            this.formData={
                className:this.classData.clazzName,
                classRoom:this.classData.clazzRoom,
                classHead:this.classData.teaName,
            }
            this.name=this.classData.teaName
        }
    }
}
</script>

<style lang="less">
    .changeAddBox{
        .placehole {
		.el-input__inner::placeholder {
			color: #606266;
		}
	}
        text-align: center;
        .el-input {
			width: 75%;
		}
		.el-select {
			width: 75%;

			.el-input {
				width: 100% !important;
			}
		}
        .el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before {
            content: '';
            margin-right: 0;
        }
    }
</style>